<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/stylesheets/style.css' />
    <style>
      body{
        padding: 50px;
      }
      a {
        color: #00b7ff;
      }
      .photos{
        display: inline-block;
        margin: 5px;
        padding: 10px;
        border: 1px solid #eee;
        border-radius: 5px;
        box-shadow: 0 1px 2px #ddd;
      }
      .photos h2{
        margin: 0;
        margin-bottom: 5px;
        font-size: 14px;
        font-weight: 200;
      }
      .photos img{
        height: 200px;
      }
    </style>
  </head>
  <body>
    <h1><%= title %></h1>
    <p>Welcome to <%= title %></p>
    <p>
      <% photos.forEach(function(photo){ %>
        <div class="photos">
          <h2><%=photo.name%></h2>
          <img src='<%= photo.path %>' alt="">
        </div>        
      <% }) %>
    </p>
  </body>
</html>
